<template>
  <div class="table-box">
    <ProTable ref="proTable" title="优惠券列表" row-key="id" :columns="columns" :request-api="getDiscountRulesList">
      <!-- :request-auto="false" -->
      <!-- 表格 header 按钮 -->
      <template #tableHeader>
        <el-button v-auth="'add'" type="primary" :icon="CirclePlus" @click="toCreate(0)"> 新增 </el-button>
      </template>
      <!-- 表格操作 -->
      <template #operation="scope">
        <el-button v-auth="'edit'" type="primary" link :icon="EditPen" @click="toCreate(scope.row.id)">
          {{ scope.row.status === 0 ? "编辑" : "查看" }}
        </el-button>
        <el-button
          v-auth="'check'"
          type="primary"
          v-if="scope.row.status === 0"
          link
          :icon="Check"
          @click="examineAccount(scope.row)"
        >
          审核
        </el-button>
        <el-button
          v-auth="'stop'"
          v-if="scope.row.status !== 2"
          type="primary"
          link
          :icon="Close"
          @click="stopAccount(scope.row)"
        >
          停用
        </el-button>
        <!-- <el-button type="primary" link :icon="Delete" @click="deleteAccount(scope.row)"> 删除 </el-button> -->
      </template>
    </ProTable>
  </div>
</template>

<script setup lang="tsx" name="discountGoods">
import { ref, onBeforeUpdate } from "vue";
import { Coupon } from "@/api/interface";
import { useRouter, useRoute } from "vue-router";
import { useHandleData } from "@/hooks/useHandleData";
import ProTable from "@/components/ProTable/index.vue";
import { CirclePlus, EditPen, Check, Close } from "@element-plus/icons-vue";
import { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
import { getDiscountRulesList, examineDiscountRules, stopDiscountRules } from "@/api/modules/coupon";
import { getDicData } from "@/api/modules/system";
import { formatDate } from "@/utils/date-formatter";
import { getLastQuarterDays } from "@/utils/date";

// 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
const proTable = ref<ProTableInstance>();

// 表格配置项
const columns: ColumnProps<Coupon.ResDiscountRulesList>[] = [
  { type: "index", label: "序号", width: 60 },
  { sortable: true, prop: "programmeCode", label: "编码", minWidth: 180 },
  {
    sortable: true,
    prop: "programmeName",
    label: "方案名称",
    minWidth: 240,
    align: "left",
    search: { el: "input", key: "reportId", label: "编码或名称", order: 2 }
  },
  {
    sortable: true,
    prop: "discountType",
    label: "促销类型",
    minWidth: 120,
    enum: () => getDicData("DiscountType"),
    search: { el: "select", order: 3 },
    fieldNames: { label: "title", value: "value" }
  },
  {
    sortable: true,
    prop: "startTime",
    label: "开始日期",
    minWidth: 164,
    search: {
      el: "date-picker",
      label: "单据日期",
      key: "dataTimeRange",
      defaultValue: [formatDate(-getLastQuarterDays(), "start", "yyyy-MM-dd"), formatDate(0, "end", "yyyy-MM-dd")],
      order: 1,
      props: {
        type: "datetimerange",
        format: "YYYY-MM-DD HH:mm",
        valueFormat: "YYYY-MM-DD HH:mm"
      }
    }
  },
  { sortable: true, prop: "endTime", label: "结束日期", minWidth: 164 },
  {
    sortable: true,
    prop: "discountUserType",
    enum: () => getDicData("DiscountUserType"),
    fieldNames: { label: "title", value: "value" },
    label: "促销人群",
    minWidth: 120
  },
  {
    sortable: true,
    prop: "status",
    label: "方案状态",
    minWidth: 120,
    enum: () => getDicData("DiscountStatus"),
    fieldNames: { label: "title", value: "value" },
    search: { el: "select", order: 4 }
  },
  { prop: "operation", label: "操作", width: 220, fixed: "right" }
];

// 跳转详情页面
const router = useRouter();
const route = useRoute();
const toCreate = (id?: number) => {
  if (id !== 0) {
    router.push({
      path: "/marketing/discount-goods-edit",
      query: {
        id: id
      }
    });
  } else {
    router.push(`/marketing/discount-goods-edit`);
  }
};

// 删除
// const deleteAccount = async (params: Goods.ResGoodsCategoryList) => {
//   await useHandleData(deleteFoodCoupon, { id: params.id }, `删除【${params.name}】分类`);
//   proTable.value?.getTableList();
// };
const examineAccount = async (params: Coupon.ResDiscountRulesList) => {
  await useHandleData(examineDiscountRules, { id: params.id }, `审核【${params.programmeName}】`);
  proTable.value?.getTableList();
};
const stopAccount = async (params: Coupon.ResDiscountRulesList) => {
  await useHandleData(stopDiscountRules, { id: params.id }, `停用【${params.programmeName}】`);
  proTable.value?.getTableList();
};
onBeforeUpdate(() => {
  if (route.query.upList) {
    proTable.value?.getTableList();
  }
});
</script>
